<template>
  <div id="app">
    <table border="1px" width="800px">
      <tr>
        <th>编号</th>
        <th>用户名</th>
        <th>密码</th>
      </tr>
      <tr v-for="user in users" :key="user.id">
        <td>{{ user.id }}</td>
        <td>{{ user.username }}</td>
        <td>{{ user.password }}</td>
      </tr>
    </table>
  </div>
</template>

<script>
export default {
  name: "UserView",
  data() {
    return {
      users: []
    };
  },
  methods: {
    loadUsers() {
      // 使用axios请求后台
      this.$axios.get('/users/list')
          .then(result => {
            if (result.data.code === 200) {
              this.users = result.data.data;
            }
          })
          .catch(error => {
            console.error("加载用户数据失败:", error);
          });
    }
  },
  mounted() {
    this.loadUsers();
  }
};
</script>

<style scoped>

</style>